<template>
  <div>
    <el-container>
      <el-header>
        <el-menu mode="horizontal"
                 @select="handleSelect"
                 background-color="#fff1a0"
                 text-color="black"
                 active-text-color="#9c9d4f">
          <el-menu-item index="1">
            <router-link to="/student/studentcourse/studentcoursecourse/studentcoursecourseall" tag="span">全部</router-link>
          </el-menu-item>
          <el-menu-item index="2">
            <router-link to="/student/studentcourse/studentcoursecourse/studentcoursecoursestart" tag="span">即将开始</router-link>
          </el-menu-item>
          <el-menu-item index="3">
            <router-link to="/student/studentcourse/studentcoursecourse/studentcoursecourseing" tag="span">进行中</router-link>
          </el-menu-item>
          <el-menu-item index="4">
            <router-link to="/student/studentcourse/studentcoursecourse/studentcoursecourseend" tag="span">已结束</router-link>
          </el-menu-item>
        </el-menu>
      </el-header>
      <el-main><router-view></router-view></el-main>
    </el-container>
  </div>
</template>

<script>
export default {
  name: "studentcoursecourse",
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    }
  }
}
</script>

<style scoped>
@import "../../assets/css/student.css";

#nav_horizontal ul {
  list-style: none;
  margin-left: 50px;
}
#nav_horizontal li {
  display: inline;
}
</style>
